<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml" 
		xmlns:ui="http://java.sun.com/jsf/facelets"
		xmlns:f="http://java.sun.com/jsf/core" 
		xmlns:c="http://java.sun.com/jstl/core" 
		xmlns:h="http://java.sun.com/jsf/html"
		xmlns:a4j="http://richfaces.org/a4j"
		xmlns:rich="http://richfaces.org/rich"
		xmlns:fn="http://www.bss.com/functions">
		
	
			<h:panelGrid columns="2" width="100%">
				<h:panelGroup>
					<h:panelGrid id="atForm1" columns="2">
						<h:outputLabel value="Name: "/>
						<h:outputText rendered="#{controller.editing}" value="#{model.attendent.name}" />
						<h:inputText id="currentAttendentSel" rendered="#{not controller.editing}" value="#{model.attendent.name}" />												
						<h:outputLabel value="Relationship" />
						<rich:comboBox id="atRel"	value="#{model.attendent.relationship}"
														suggestionValues="#{relationshipDao.all}"
														converter="#{relationshipConverter}"
														enableManualInput="true"/>
						<h:outputLabel value="Sex:" />
						<h:selectOneRadio id="atSex" value="#{model.attendent.sex}">
											<f:selectItem itemLabel="Male" itemValue="M"/>
											<f:selectItem itemLabel="Female" itemValue="F"/>
										</h:selectOneRadio>	
						<h:outputLabel value="Date of Birth: " />
						<rich:calendar id="atAge" inputSize="10"
							oninputblur="if(!validateDate($('atAgeInputDate').value)){alert('Entered date '+$('atAgeInputDate').value+' is not valid !\nChanging to current date !');$('atAgeInputDate').value='#{utils.today}'}" 
						enableManualInput="true" value="#{model.attendent.dateOfBirth}"
							datePattern="dd/MM/yyyy"/>
						<h:outputLabel value="ID Card Type:" />
						<rich:comboBox id="atIdt"	value="#{model.attendent.idCardType}" 
														suggestionValues="#{idCardTypeDao.all}"
														converter="#{idCardTypeConverter}"
														enableManualInput="true">
							<a4j:support event="onchange" limitToList="true" reRender="idPatPanel1,idPatPanel2"/>
						</rich:comboBox>
						<h:panelGroup id="idPatPanel1">
								<h:outputLabel rendered="#{model.attendent.idCardType.name ne 'Passport'}" value="ID Card Number:" />
								<h:outputLabel rendered="#{model.attendent.idCardType.name eq 'Passport'}" value="Passport Details:" />
							</h:panelGroup>
						<h:panelGroup id="idPatPanel2">
							<h:inputText style="display:#{model.attendent.idCardType.name ne 'Passport' ? 'block':'none'}" id="atIdn" value="#{model.attendent.idCardNumber}"/>
							<h:panelGrid style="display:#{model.attendent.idCardType.name eq 'Passport' ? 'block':'none'}" columns="2" >
								<h:outputLabel value="Number: " /><h:inputText value="#{model.attendent.passport.passportNumber}"/>
								<h:outputLabel value="Date of issue: " /><rich:calendar inputSize="10" enableManualInput="true" 
																				value="#{model.attendent.passport.dateOfIssue}" datePattern="dd/MM/yyyy"/>	
								<h:outputLabel value="Date of expiry: " /><rich:calendar inputSize="10" enableManualInput="true" 
																				value="#{model.attendent.passport.dateOfExpiry}" datePattern="dd/MM/yyyy"/>
						</h:panelGrid>
						</h:panelGroup>
						
						<h:outputLabel value="Phone: "/>
						<h:inputText value="#{model.attendent.phone}" />
						
						<h:outputLabel value="Profession" />
						<rich:comboBox id="atPro"	value="#{model.attendent.profession}"
														suggestionValues="#{professionDao.all}"
														converter="#{professionConverter}"
														enableManualInput="true"/>						
					</h:panelGrid>
					
					<h:panelGroup style="margin-top:10px; text-align:center" layout="block" >						
						<a4j:commandButton rendered="#{not controller.editing}"  value="Add" action="#{controller[addMethod]}"
							reRender="dtblCurrentAttendents,atForm1,#{reRender}"
							onclick="showLoading();" limitToList="true"
							oncomplete="hideLoading();#{onAddComplete}"/>
						<rich:spacer width="10px"/>
						<h:commandButton rendered="#{controller.editing}" onclick="showLoading();" action="#{controller.update}" value="Update" />
						<rich:spacer width="10px"/>
						<h:commandButton rendered="#{controller.editing}" onclick="showLoading();" value="Cancel" action="#{controller.cancel}" />
					</h:panelGroup>
								
				</h:panelGroup>							
							
								<rich:dataTable id="dtblCurrentAttendents" 
												value="#{data}" var="aBean" align="center" >
									<f:facet name="header">
										<h:outputText value="Current Attendents"/>
									</f:facet>		
									<rich:column rendered="#{not empty requiredEditing}" >
										<f:facet name="header">
											<h:outputText value="Edit" />
										</f:facet>
										<h:commandButton style="width:15px;height:15px;#{controller.editing ? 'cursor: not-allowed':''}"  onclick="showLoading();" 
											title="#{controller.editing ? 'Edit already in progress...':'Click to Edit'}" image="/resrc/images/edit1.jpg"
											disabled="#{controller.editing}" action="#{controller.select}" />
									</rich:column>						
									<rich:column>
										<f:facet name="header">
											<h:outputText value="Delete"/>
										</f:facet>							
										<a4j:commandButton image="/resrc/images/cross1.jpg"
															style="width:15px;height:15px;#{controller.editing ? 'cursor: not-allowed':''}" disabled="#{controller.editing}"
															action="#{controller[removeMethod]}" reRender="dtblCurrentAttendents,#{reRender}"
															onclick="if(#{not empty askConfirmation} &amp;&amp; !showConfirmation('Are you sure to checkout #{aBean.attendent.name} ?'))return false;showLoading();" limitToList="true"
															title="#{controller.editing ? 'Edit in progress...':'Click to delete'}"
															oncomplete="hideLoading();"/>
									</rich:column>
									<rich:column>
										<f:facet name="header">Details</f:facet>
										<h:panelGrid columns="2">
											<h:outputLabel value="Name:" />
											<h:outputText value="#{aBean.attendent.name} "/>
											<h:outputLabel value="Relationship:" />
											<h:outputText value="#{aBean.attendent.relationship}" converter="#{relationshipConverter}"/>
											<h:outputLabel value="Sex:" />
											<h:outputText value="#{aBean.attendent.sex == 'M' ? 'Male' : 'Female'} "/>
											<h:outputLabel value="Date of Birth:" />
											<h:outputText value="#{aBean.attendent.dateOfBirth}">
												<f:convertDateTime pattern="dd MMM yyyy" timeZone="#{preferences.timeZone.ID}"/>
											</h:outputText>
											<h:outputLabel value="ID:" />
											<h:panelGroup>
												<h:outputText value="#{aBean.attendent.idCardType.name}"/>
												<h:outputText value="( #{aBean.attendent.idCardType.name eq 'Passport' ? aBean.attendent.passport.passportNumber : aBean.attendent.idCardNumber} )"/>
											</h:panelGroup>
											<h:outputLabel value="Profession:" />
											<h:outputText value="#{aBean.attendent.profession}" converter="#{professionConverter}"/>
											<h:outputLabel value="Phone: "/>
											<h:outputText value="#{aBean.attendent.phone}" />
											<h:outputLabel value="Check in Date:" />
											<h:outputText value="#{aBean.dateOfArrival}">
												<f:convertDateTime pattern="dd MMM yyyy" timeZone="#{preferences.timeZone.ID}"/>
											</h:outputText>																					
										</h:panelGrid>
									</rich:column>
																										
									<f:facet name="footer">
										<h:outputText rendered="#{empty data or data['rowCount'] le 0}" value="No Attendents Added..." />
									</f:facet>									
								</rich:dataTable>															
			</h:panelGrid>
</ui:composition>

